<template>
  <div>
    <div class='my_top'>
      <img style='top:0; z-index: -1; position: absolute; width:100%; height:478rpx;' src='/static/images/pet_beijing.jpg' />
      <div class='ziliao'>
        <div style='margin-top:60rpx;margin-left:30rpx;'>
          <span style='font-size: 60rpx; color:#383838;'>ONE</span>
          <div class='vip' style=''>会员主子</div>
        </div>
        <div class='touxiang'>
          <img style='width:128rpx;height:128rpx;border-radius: 66rpx;' src='/static/images/index_pet1.png' />
        </div>
      </div>
      <div class='yue'>
        <div class='neir'>
          <span>积分</span>
          <span>850</span>
        </div>
        <div class='neir'>
          <span>余额</span>
          <span>714</span>
        </div>
        <div class='neir'>
          <span>优惠券</span>
          <span>3</span>
        </div>
      </div>
    </div>

    <div class='my_xinxi'>
      <div class='xiangxi' @click='order'>
        <div class='xiangxi_left'>
          <img src='/static/images/my_icon1.png' />
          <span>订单</span>
        </div>
        <div class='xiangxi_right'>
          <img src='/static/images/my_right.png' />
        </div>
      </div>
      <div class='xiangxi' @click='address'>
        <div class='xiangxi_left'>
          <img src='/static/images/my_icon2.png' />
          <span>收货地址</span>
        </div>
        <div class='xiangxi_right'>
          <img src='/static/images/my_right.png' />
        </div>
      </div>
      <div class='xiangxi'>
        <div class='xiangxi_left'>
          <img src='/static/images/my_icon3.png' />
          <span>我的优惠券</span>
        </div>
        <div class='xiangxi_right'>
          <img src='/static/images/my_right.png' />
        </div>
      </div>
      <!-- <div class='xiangxi'>
    <div class='xiangxi_left'>
      <img src='/static/images/my_icon4.png'/>
      <span>我的收藏</span>
    </div>
    <div class='xiangxi_right'>
      <img src='/static/images/my_right.png'/>
    </div>
  </div>
  <div class='xiangxi'>
    <div class='xiangxi_left'>
      <img src='/static/images/my_icon5.png'/>
      <span>消费记录</span>
    </div>
    <div class='xiangxi_right'>
      <img src='/static/images/my_right.png'/>
    </div>
  </div>
  <div class='xiangxi'>
    <div class='xiangxi_left'>
      <img src='/static/images/my_icon6.png'/>
      <span>设置</span>
    </div>
    <div class='xiangxi_right'>
      <img src='/static/images/my_right.png'/>
    </div>
  </div> -->

    </div>
  </div>
</template>

<script>
import { formatTime } from "@/utils/index";
import card from "@/components/card";

export default {
    components: {
        card
    },

    data() {
        return {
            logs: []
        };
    },

    created() {
        const logs = wx.getStorageSync("logs") || [];
        this.logs = logs.map(log => formatTime(new Date(log)));
    },
    onReady() {
        wx.navigateTo({
            url: "/pages/login/main"
        });
    },
    methods: {
        order: function() {
            wx.navigateTo({
                url: "/pages/order/main"
            });
        },
        address: function() {
            wx.navigateTo({
                url: "/pages/addressList/main"
            });
        }
    }
};
</script>

<style>
.page {
    position: relative;
}

.my_top .vip {
    border: 1px solid #fff;
    border-radius: 47rpx;
    width: 150rpx;
    height: 49rpx;
    font-size: 28rpx;
    text-align: center;
    line-height: 49rpx;
    color: #fff;
}

.my_top {
    width: 100%;
    height: 478rpx;
}

.my_top .ziliao {
    display: flex;
    justify-content: space-between;
}

.my_top .ziliao .touxiang {
    margin-top: 80rpx;
    margin-right: 30rpx;
}

.my_top .yue {
    width: 400rpx;
    height: 100rpx;
    display: flex;
    justify-content: space-between;
    margin-left: 320rpx;
    margin-top: 60rpx;
}

.my_top .yue .neir {
    display: flex;
    flex-direction: column;
    text-align: center;
    color: #fff;
    font-size: 28rpx;
}

.my_xinxi .xiangxi {
    display: flex;
    justify-content: space-between;
    margin: 18rpx 30rpx;
    height: 82rpx;
    border-bottom: 1px solid #f9f9f9;
    align-items: center;
}

.my_xinxi .xiangxi .xiangxi_left {
    display: flex;
    justify-content: center;
    align-items: center;
}

.my_xinxi .xiangxi .xiangxi_left image {
    width: 40rpx;
    height: 40rpx;
    margin-right: 20rpx;
}

.my_xinxi .xiangxi .xiangxi_left text {
    font-size: 32rpx;
    color: #505050;
}

.my_xinxi .xiangxi .xiangxi_right image {
    width: 32rpx;
    height: 32rpx;
    opacity: 0.5;
}
</style>
